<template>
<div class="product-management views-container">
  <div class="wlm-table" style="min-height:300px;padding-top:30px;">
    <div class="wlm-table-content">
      <el-table :ref="tableFormatData.userTable.key" :data="tableFormatData.userTable.tableData" @selection-change="handleSelectionChange"> style="width: 100%">
        <el-table-column label="" width="20">
        </el-table-column>
        <el-table-column prop="date" label="产品LOGO" width="120" align="center">
          <template slot-scope="scope">
            <img class="logo-img" :src="scope.row.logo" alt="">
          </template>
        </el-table-column>
        <el-table-column prop="date" label="产品名称" align="center" width="200">
          <template slot-scope="scope">
            <span>{{scope.row.title}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="name" label="产品描述" align="center" width="500">
          <template slot-scope="scope">
            <span>{{scope.row.detail}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="name" label="排序" align="center">
          <template slot-scope="scope">
            <span>{{scope.row.sort}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="name" label="状态" align="center">
          <template slot-scope="scope">
            <el-switch :active-value="1" :inactive-value="0" @change="changeTableItem({id:scope.row.id,is_ban:scope.row.is_ban},tableFormatData.userTable.change.is_ban)" v-model="scope.row.is_ban"> </el-switch>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <div class="operation-group">
              <router-link class="wlm-text" tag="span" :to="{path:'/operation/platformPackageAdd', query:{id:scope.row.id}}">
                <el-button type="text">编辑</el-button>
              </router-link>
              <div class="btn-line"></div>
              <router-link class="wlm-text" tag="span" to="/operation/pluginManagement">
                <el-button type="text">产品插件</el-button>
              </router-link>
              <div class="btn-line"></div>
              <router-link class="wlm-text" tag="span" to="">
                <el-button type="text">产品套餐</el-button>
              </router-link>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</div>
</template>

<script>
import {
  productList,
  changeStatus
} from '@/api/operation'
import mixins from '@/mixins/mixins'
export default {
  mixins: [mixins.getters('Table')],
  name: 'ProductManagement',
  components: {

  },
  computed: {

  },
  data() {
    return {
      monidata: [{
        date: '2016-05-02',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }],
      tableFormatData: {
        current: 'userTable',
        userTable: {
          key: 'userTable',
          api: {
            getList: productList
          },
          tableData: [],
          noPages: true,
          files: {
            ids: [],
            checkall: '0'
          },
          change: {
            is_ban: {
              name: '编辑',
              key: 'is_ban',
              api: changeStatus
            }
          },
          pagination: {
            pindex: 1,
            psize: 10,
            pagesizes: [10, 20, 50],
            total: 10
          }
        }
      }
    }
  },
  created() {

  },
  methods: {
    // tableGetListCallBack() {

    // }
  }
}
</script>

<style lang="scss" scoped>
.product-management {
  .logo-img {
    height: 40px;
    width: 40px;
    border-radius: 40px;
  }
}
</style>
